import { VFC, lazy, Suspense, useCallback } from 'react'
import style from './main-app.module.less'
// import { Button } from 'antd';
// import { Example } from 'zw-components';
import { Route, Switch, BrowserRouter, Redirect } from 'react-router-dom';
import { RouterGuard, PageLoading } from 'zw-components';
import { LoginAuth, MainLayout, Wait } from '@common';
import zhCN from 'antd/lib/locale/zh_CN';
import { ConfigProvider, DatePicker, message } from 'antd';
import moment from 'moment';
moment.locale('zh-cn');
// import { LoginPage } from './pages/login';
// @ts-ignore
const waitingTime = __ENV__ === 'development' ? 1000:100;

const LoginPage = lazy(() => {
  return Promise.all([import('./pages/login/index'), Wait(waitingTime)]).then(res => res[0]);
});

const MainPage = lazy(() => {
  return Promise.all([import('./pages/mian/index'), Wait(waitingTime)]).then(res => res[0]);
});
const NotFound = lazy(() => import('./pages/notFound/index'));
const Router: any = Route;

const App: VFC = () => {
  return (
    <ConfigProvider locale={zhCN}>
      <div className={style.app}>
        <BrowserRouter>
          <Suspense fallback={<PageLoading />}>
            <Switch>
                <LoginAuth path="/login" component={LoginPage}/>
                <LoginAuth path="/main/*" component={MainPage}/>
                <Router path="/404" component={NotFound}/>
                <Redirect to='/404'/>
            </Switch>
          </Suspense>
        </BrowserRouter>
      </div>
    </ConfigProvider>
  )
}

export default App
